import React from 'react'
import { RouterChlientList } from '../../router'
import { Outlet, useNavigate } from "react-router-dom"
import { TabBar } from 'antd-mobile'
import styles from "./index.module.css"
const Index = () => {
    const navigate = useNavigate()
    return (
        <div>
            <main className={styles.bt}>
                <Outlet />
            </main>
            <footer>
                <TabBar onChange={(val) => navigate(val)}>
                    {RouterChlientList.map(item => (
                        <TabBar.Item key={item.path} icon={item.icon} title={item.title} />
                    ))}
                </TabBar>
            </footer>
        </div>
    )
}

export default Index
